import React from "react"
import Router from "./Router"
import "./components/@vuexy/rippleButton/RippleButton"
import themeConfig from "./configs/themeConfig"
import "react-perfect-scrollbar/dist/css/styles.css"
import "prismjs/themes/prism-tomorrow.css"
import {connect} from "react-redux";
import {setNotification, unsetNotification, updateNotification} from "./redux/actions/helper";
import {changeConfig} from "./redux/actions/customizer";
import Notification from "./components/@vuexy/notification";
import {changeUserData} from "./redux/actions/users";
import {logoutUser} from "./redux/actions/auth/loginActions";

class App extends React.Component {
  componentDidMount() {
    this.themeConfig(this.props)
    this.UserData(this.props)
  }

  UserData(props) {
    try {
      let data = JSON.parse(localStorage.getItem('userData'))
      if (data) {
        props.changeUserData(data);
      }else{
        props.changeUserData({});
        localStorage.setItem('userData','{}')
      }
    } catch (e) {
      localStorage.setItem('themeConfig', '{}')
      props.changeUserData({});
    }
  }

  themeConfig(props) {
    try {
      let data = JSON.parse(localStorage.getItem('themeConfig'))
      if (data) {
        props.changeConfig(data);
      }else{
        localStorage.setItem('themeConfig',JSON.stringify(themeConfig))
      }
    } catch (e) {
      localStorage.setItem('themeConfig', JSON.stringify(themeConfig))
      props.changeConfig(themeConfig);
    }
  }

  render() {
    return (
      <>
        <Notification/>
        <Router/>
      </>
    )
  }
}

export default connect(null, {changeConfig, changeUserData, logoutUser})(App);
